import { createRouter, createWebHashHistory } from 'vue-router'
import HomeView from '@/views/HomeView.vue'
import Sidebar from '@/components/nav/NavComponents.vue'

const routes = [
  {
    path: '/',
    name: '首页',
    meta: {
      title: "首页",
      roles: ['user', 'admin']
    },
    redirect: '/dashboard',
    leaf: true, //是否为单节点，增加属性
    id:"1",
    menuShow: true,
    component: HomeView,
    icoClass: 'icon-cloud-homepage',
    children: [
      //管理首页
      {
        path: '/dashboard',
        name: "管理首页",
        meta: {
          title: "管理首页",
          roles: ['user', 'admin']
        },
        leaf: true, //是否为单节点，增加属性
        menuShow: true,
        components: {
          default: () => import('@/views/main/Dashboard.vue'),
          sidebar: Sidebar
        }
      },
      //权限403
      {
        path: '/403',
        name: "403",
        meta: {
          title: "403无权限",
          roles: ['user', 'admin']
        },
        components: {
          default: () => import('@/views/main/403.vue'),
          sidebar: Sidebar
        }
      },
      //不存在404
      {
        path: '/404',
        name: "404",
        meta: {
          title: "404不存在",
          roles: ['user', 'admin']
        },
        components: {
          default: () => import('@/views/main/404.vue'),
          sidebar: Sidebar
        }
      },
    ]
  },  
  //文档管理
  {
    path: '/docmanager',
    name: "文档管理",
    components: {
      default: HomeView,
      sidebar: Sidebar
    },
    meta: {
      title: "文档管理",
      roles: ['user', 'admin']
    },
    leaf: false, //是否为单节点，增加属性
    id:"2",
    menuShow: true,
    icoClass: 'icon-cloud-req-sprite',
    children: [
      //新建文档
      {
        path: '/docmanager/editor',
        name: "富编辑器",
        meta: {
          title: "富文本编辑器",
          roles: ['user', 'admin']
        },
        id:"2-1",
        menuShow: true,
        icoClass:"icon-req-2d",
        components: {
          default: () => import('@/views/doc/editor.vue'),
          sidebar: Sidebar
        }
      },
      //添加文档
      {
        path: '/docmanager/table',
        name: "表格管理",
        meta: {
          title: "表格管理",
          roles: ['user', 'admin']
        },
        id:"2-2",
        menuShow: true,
        icoClass:"icon-bug-2d",
        components: {
          default: () => import('@/views/doc/table-editor.vue'),
          sidebar: Sidebar
        }
      },
    ]
  },  
  //项目管理
  {
    path: '/project',
    name: "项目管理",
    components: {
      default: HomeView,
      sidebar: Sidebar
    },
    meta: {
      title: "项目管理",
      roles: ['user', 'admin']
    },
    leaf: false, //是否为单节点，增加属性
    id:"3",
    menuShow: true,
    icoClass: 'icon-cloud-modeling',
    children: [
      //默认项目
      {
        path: '/project/index',
        name: "默认项目",
        meta: {
          title: "默认项目",
          roles: ['user', 'admin']
        },
        id:"3-1",
        menuShow: true,
        icoClass:"icon-cloud-release-manage-2d",
        components: {
          default: () => import('@/views/project/IndexView.vue'),
          sidebar: Sidebar
        }
      },
      //项目设计
      {
        path: '/project/design',
        name: "项目设计",
        meta: {
          title: "项目设计",
          roles: ['user', 'admin']
        },
        id:"3-2",
        menuShow: true,
        icoClass:"icon-cloud-build-2d-devcloud",
        components: {
          default: () => import('@/views/project/projectDesign.vue'),
          sidebar: Sidebar
        }
      },
      //项目维护
      {
        path: '/project/maintenance',
        name: "项目维护",
        meta: {
          title: "项目维护",
          roles: ['user', 'admin']
        },
        id:"3-3",
        menuShow: true,
        icoClass:"icon-operation-maintenance-2d",
        components: {
          default: () => import('@/views/project/projectMaintenance.vue'),
          sidebar: Sidebar
        }
      },
      //思维导图
      {
        path: '/project/mindmap',
        name: "思维导图",
        meta: {
          title: "思维导图",
          roles: ['user', 'admin']
        },
        id:"3-4",
        menuShow: true,
        icoClass:"icon-cloud-pipeline-2d-devcloud",
        components: {
          default: () => import('@/views/project/projectMindMap.vue'),
          sidebar: Sidebar
        }
      },
      //文件管理
      {
        path: '/project/manager',
        name: "文件管理",
        meta: {
          title: "文件管理",
          roles: ['user', 'admin']
        },
        id:"3-5",
        menuShow: true,
        icoClass:"icon-cloud-deploy-2d",
        components: {
          default: () => import('@/views/project/uploadFiles.vue'),
          sidebar: Sidebar
        }
      },
    ]
  },
  //其他项目管理
  {
    path: '/403',
    name: '其他管理',
    meta: {
      title: "项目管理",
      roles: ['user', 'admin']
    },
    redirect: '/403',
    leaf: true, //是否为单节点，增加属性
    id:"4",
    menuShow: true,
    icoClass: 'icon-dashboard-sprite',
    component: HomeView,
    children: [
      {
        path: '/403',
        name: '项目',
        meta: {
          title: "项目管理",
          roles: ['user', 'admin']
        },
        leaf: true, //是否为单节点，增加属性
        menuShow: true,
        components: {
          default: () => import('@/views/project/IndexView.vue'),
          sidebar: Sidebar
        }
      },
    ]
  },
  {
    path: '/news',
    name: 'news',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '@/views/main/NewsView.vue')
  }, 
  //登录页面
  {
    path: '/login',
    name: 'login',
    meta: {
      title: "登录页面",
    },
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '@/views/LoginView.vue')
  },  
  //注册页面
  {
    path: '/reg',
    name: 'register',
    meta: {
      title: "注册页面",
    },
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '@/views/RegView.vue')
  },
]

//将路由表信息存放到store中,注意变量名称不要写错了
// localStorage.setItem('route', JSON.stringify(routes));

const router = createRouter({
  history: createWebHashHistory(),
  routes
})

// 路由守卫
//路由验证登录
router.beforeEach((to, from, next) => {
  const user = localStorage.getItem("token");
  //在登录页面或者注册页面时加载
  localStorage.setItem('route', JSON.stringify(routes));
  let user_role = 'user'; // 默认角色为'user'

  // 如果localStorage中有用户信息，则更新user_role
  if (localStorage.getItem('User')) {
    user_role = JSON.parse(localStorage.getItem('User')).user_role || 'user';
  }

  // 如果是注册或登录页面，直接放行
  if (to.path === '/reg' || to.path === '/login') {
    next();
    
    return;
  }

  // 检查用户是否已登录
  if (user || to.path === '/login') {
    // 如果路由有角色要求，并且用户角色不在允许的角色列表中
    if (to.meta.roles && !to.meta.roles.includes(user_role) && to.path !== '/login' && to.path !== '/reg') {
      // 无权限，重定向到403页面
      next('/403');
    } else {
      // 有权限，正常导航
      next();
    }
  } else {
    // 用户未登录，重定向到登录页面
    next('/login');
  }
});

export default router
